.rule-pair-source-row-wrapper {
  display: flex;
  gap: 2px;
}

.rules-pair-content-header {
  padding: 4px;
  box-shadow: var(--input-box-shadow);
  border-radius: var(--border-radius-sm);
  background-color: var(--requestly-color-surface-0);
}

.rule-pair-source-dropdown {
  font-size: var(--requestly-font-size-sm);
  background-color: var(--requestly-color-surface-1);
}

.rules-pair-content-header .rules-pair-input,
.rules-pair-content-header .rules-pair-input:focus {
  width: 100%;
  border: none;
  box-shadow: none;
  background-color: transparent;
  font-size: var(--requestly-font-size-sm);
}

.source-filter-col.ant-col {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-left: 0;
}

.source-filter-icon-container {
  gap: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.source-filter-modal-description {
  font-size: var(--requestly-font-size-sm);
  color: var(--requestly-color-subtle);
  margin-bottom: 1rem;
}

.sample-regex-dropdown-container {
  margin-top: 4px;
  cursor: pointer;
  color: var(--requestly-color-primary-400);
  font-size: var(--requestly-font-size-sm);
  transition: color 0.2s ease;
}

.sample-regex-dropdown-container:hover {
  color: var(--requestly-color-primary-300);
}

.sample-regex-dropdown .ant-dropdown-menu.ant-dropdown-menu-root li.ant-dropdown-menu-item {
  padding: 12px;
}

.sample-regex-dropdown-item__title {
  font-size: var(--requestly-font-size-sm);
  color: var(--requestly-color-default);
}

.sample-regex-dropdown-item__regex {
  font-size: var(--requestly-font-size-2xs);
  color: var(--requestly-color-subtle);
  margin-top: 8px;
}

.source-filter-icon-container .badge-active {
  color: var(--requestly-color-primary-300);
}

.source-filter-icon-container .badge-active .ant-badge {
  color: var(--requestly-color-neutral-100);
  background-color: var(--requestly-color-primary-500);
  border-radius: 4px;
  font-size: var(--requestly-font-size-xs);
  padding: 2px 4px;
  line-height: var(--requestly-font-line-height-sm);
}
